5分钟动效 | Principle 制作标签切换动效

2019-11-25 16:08:34

视频教程中用到的 Sketch 和 Principle 源文件，均可从文末提供的方式获取。

 

效果预览

 

制作思路

• 将整理好的 Sketch 文件导入 Principle；

• 依次将各个标签添加点击事件（Tap）；

• 复制、粘贴不同屏幕内容，调整位置，形成补间动画；

• 为标签线添加弹性动画（Spring），并设置参数值；

• 为内容添加缓入缓出动画（Ease Both），使运动更自然；

• 预览整体效果，满意后导出 Gif 或 Mov，大功告成！

 

获取源文件

 

 

本期「5分钟动效 · 基础」就到这里，教程仅展示制作思路，大家可以自由发挥，欢迎提交你的小作品。你也可以关注我的公众号「彭彭设计笔记」，我会用简练的文字，为你提炼最有价值的设计知识。

 

关键词：h5宣传是什么 h5写页面 学习h5网站

↑ 回到顶部